.saturationWhite {
  background: linear-gradient(to right, #fff, rgba(255, 255, 255, 0));
}

.saturationBlack {
  background: linear-gradient(to top, #000, rgba(0, 0, 0, 0));
}

.color,
.white,
.black,
.pointer {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.color {
  border-radius: 0;
}

.white {
  border-radius: 0;
}

.black {
  border-radius: 0;
}

.pointer {
  cursor: default;
}

.circle {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  box-shadow: 0 0 0 1.5px #fff, inset 0 0 1px 1px rgba(0, 0, 0, 0.3), 0 0 1px 2px rgba(0, 0, 0, 0.4);
  transform: translate(-2px, -2px);
  cursor: hand;
}
